<!doctype html>
<html class="loading" lang="en">
  <head>
    <title>Browserosaurus: for macOS multi-browser users.</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="initial-scale=1.0, width=device-width" />

    <link
      rel="apple-touch-icon"
      sizes="180x180"
      href="/apple-touch-icon.png?v=20"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/favicon-32x32.png?v=20"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="16x16"
      href="/favicon-16x16.png?v=20"
    />
    <link rel="manifest" href="/site.webmanifest?v=20" />
    <link rel="mask-icon" href="/safari-pinned-tab.svg?v=20" color="#071a25" />
    <link rel="shortcut icon" href="/favicon.ico?v=20" />
    <meta name="msapplication-TileColor" content="#071a25" />
    <meta name="theme-color" content="#071a25" />

    <link rel="stylesheet" href="/style.css" />

    <script
      defer
      src="https://celadon-seriema.pikapod.net/script.js"
      data-website-id="9e7e39fb-b555-4e5f-979f-d735995a5567"
      data-domains="browserosaurus.com"
    ></script>
  </head>
  <body
    class="bg-white dark:bg-zinc-900 text-zinc-700 dark:text-zinc-50 min-h-screen flex flex-col overflow-x-hidden"
  >
    <header class="shrink-0 py-4">
      <div class="container mx-auto flex sm:items-center">
        <a
          class="-ml-2 flex gap-3 sm:items-center px-4 py-3 text-lg shrink-0 flex-col sm:flex-row"
          href="/"
          ><span
            ><img src="/icon_squooshed.png" alt="" width="60" height="60"
          /></span>
          <div class="pl-3 sm:pl-0">
            <span class="font-bold">Browser</span
            ><span class="font-light">osaurus</span>
          </div></a
        >
        <a
          class="ml-auto block pr-4 pt-6 sm:pt-0"
          href="https://www.buymeacoffee.com/wstone"
          ><img src="yellow-button.png" class="w-40"
        /></a>
      </div>
    </header>

    <main class="grow flex items-center">
      <div
        class="container mx-auto px-4 py-4 lg:py-16 flex flex-col lg:flex-row gap-8 lg:items-center"
      >
        <div class="lg:w-6/12 lg:order-2">
          <img src="/screenshot.jpg" alt="" class="rounded shadow-lg" />
        </div>
        <div class="lg:w-6/12 lg:order-1">
          <div
            class="text-zinc-800 dark:text-zinc-50 text-4xl sm:text-6xl font-semibold"
          >
            For macOS multi-browser users.
          </div>
          <div
            class="mt-5 text-zinc-500 dark:text-zinc-400 text-2xl md:text-3xl font-semibold"
          >
            Select from any of your installed browsers when clicking a link in a
            non-browser app.
          </div>
          <pre
            class="mt-12 overflow-x-auto"
          ><code class="before:content-['$'] before:mr-2 select-all"
            >brew install --cask browserosaurus</code
          ></pre>
          <div class="mt-12 flex flex-wrap gap-5 items-center">
            <a
              class="w-full sm:w-auto text-xl text-center font-semibold select-none text-white px-5 py-3 rounded-md shadow-md dark:shadow-none bg-indigo-500 shadow-indigo-500/25 transition-all hover:bg-indigo-500/90 active:bg-indigo-600 active:shadow-sm"
              href="https://github.com/will-stone/browserosaurus/releases"
              >Download for free</a
            ><a
              class="w-full sm:w-auto text-xl text-center px-5 py-3 text-indigo-500 hover:text-indigo-500/90 active:text-indigo-600 dark:text-indigo-400 dark:hover:text-indigo-400/90 dark:active:text-indigo-500"
              href="https://github.com/will-stone/browserosaurus#readme"
              >Learn more on GitHub</a
            >
          </div>
          <p class="mt-4 text-zinc-500 dark:text-zinc-400">
            Select x64 for Intel machines, or arm64 for Apple Silicon (M1)
            machines.
          </p>
        </div>
      </div>
    </main>

    <footer class="shrink-0 bg-zinc-50 dark:bg-zinc-800 text-zinc-500 mt-16">
      <div class="container mx-auto px-4 py-12">
        Created by
        <a
          class="font-bold text-zinc-800 dark:text-zinc-50 hover:text-indigo-500"
          href="https://wstone.uk"
          >Will Stone</a
        >.
      </div>
    </footer>
  </body>
</html>
